import Flow from "@/components/core/workflow/Flow";
import { AppDetailContext } from "@/context/app/detail/appDetailContext";
import WorkflowContextProvider, { WorkflowContext } from "@/context/WorkflowContext";
import { AppContext } from "@/web/core/app/context/appContext";
import { Flex, Grid } from "@chakra-ui/react";
import { useMount } from "ahooks";
import React, { useMemo } from "react";
import Header from "./Header";
import { appSystemModuleTemplates } from "@/components/core/workflow/Flow/template/constants";
type Props = { onClose: () => void };

const Render = () => {
    const { appDetail } = React.useContext(AppDetailContext);
    const { initData } = React.useContext(WorkflowContext);

    console.log(appDetail,'appDetail',initData)
    const workflowData = {
        nodes:appDetail.modules,
        edges:appDetail.edges
    }

    useMount(() => {
        console.log('workflowData',workflowData)
        initData(workflowData)
    })

    const memoRender = useMemo(() => {
        return (
            <Grid className="h-screen grid-rows-flow-box gap-0">
                <Header />
                <Flow></Flow>
            </Grid>
        );
    }, []);

    return memoRender;
}
export default React.memo(function FlowEdit(props: Props) {

    return (
        <WorkflowContextProvider basicNodeTemplates={appSystemModuleTemplates}>
           <Render></Render>
        </WorkflowContextProvider>
    );
});